<script type="text/javascript" src="libs/image_preview_alter.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        var dsNgheSi={
            datatype: "json",
            cache: false,
            datafields: [
                { name: 'id', type: 'int' },
                { name: 'tenthat', type: 'string' },
                { name: 'nghedanh', type: 'string' },
                { name: 'ngaysinh', type: 'string' },
                { name: 'tieusu', type: 'string' },
                { name: 'conhoatdong', type: 'string' },
                { name: 'like', type: 'int' }
            ],
            id:'id',
            url:'libs/DSNgheSi.php',
            addrow: function (rowid, rowdata, position, commit) {
                // synchronize with the server - send insert command
                var data = "action=insert&" + $.param(rowdata);
                console.log(data);
                $.ajax({
                    url: 'controllers/NgheSi_Controller.php',
                    data: data,
                    type: "POST",
                    cache: false,
                    success: function (data, status, xhr) {
                        // insert command is executed.
                        commit(true);
                        $('#nghesi_danhsach').jqxGrid('updatebounddata');
                        //dat gia tri cho the input id=nghesi_id, de no submit cung voi form
                        $("#nghesi_ma").val(data);
                        $("#nghesi_anhdaidien_upload").submit();
                        console.log("add commited");
                    },
                    error: function (jqXHR, textStatus, errorThrown) {
                        console.log(textStatus + "  " + errorThrown + "   " + jqXHR.responseText);
                        commit(false);;
                    }
                });
            },
            deleterow: function (rowid, commit) {
                // synchronize with the server - send delete command
                var data = "action=delete&" + $.param({ id: rowid });
                $.ajax({
                    url: 'controllers/NgheSi_Controller.php',
                    cache: false,
                    type: "POST",
                    data: data,
                    success: function (data, status, xhr) {
                        // delete command is executed.
                        alert("Xóa nghệ sĩ thành công");
                        commit(true);
                        $('#nghesi_danhsach').jqxGrid('updatebounddata');
                        console.log("delete commited");
                    },
                    error: function (jqXHR, textStatus, errorThrown) {
                        console.log(textStatus + "  " + errorThrown + "   " + jqXHR.responseText);
                        alert("Không thể xóa nghệ sĩ");
                        commit(false);
                    }
                });
            },
            updaterow: function (rowid, rowdata, commit) {
               // synchronize with the server - send update command
               var data = "action=update&" + $.param(rowdata);
               $.ajax({
                   url: 'controllers/NgheSi_Controller.php',
                   cache: false,
                   data: data,
                   type: "POST",
                   success: function (data, status, xhr) {
                       // update command is executed.
                       commit(true);
                       $('#nghesi_danhsach').jqxGrid('updatebounddata');
                       console.log("update commited");
                   },
                   error: function (jqXHR, textStatus, errorThrown) {
                       console.log(textStatus + "  " + errorThrown + "   " + jqXHR.responseText);
                       commit(false);
                   }
               });
           }
        };
    var conhoatdong_renderer = function (row, columnfield, value) {
        if (value == 1) {
                //console.log("conkhi");
            return '<center><img src="resources/img/active.png" width="16px" height="16px align="middle"></center>';
            //return "con";
        }
        else {
            return '<center><img src="resources/img/inactive.png" width="16px" height="16px align="middle"></center>';
            //return "khong con";
        }
    };
    var nghedanh_renderer = function(row, columnfield, value){
        var data = $('#nghesi_danhsach').jqxGrid('getrowdata', row);
        var id = data["id"];
        var fileName= "resources/img/nghe_si/" + id + ".png";
        var res = '<img src="' + fileName + '" width="40px" height="40px" style="vertical-align: middle;" onerror="changeSrc(this);"/>  ' + 
                '<strong>' + value + '</strong>';      
        return res;
    };
    var dataAdapter = new $.jqx.dataAdapter(dsNgheSi, {
        formatData: function (data) {
            $.extend(data, {
                login: $("#islogin").val()
            });
            return data;
        }
    });
    $('#nghesi_danhsach').on('rowclick', function (event){
        var args = event.args;
        var row = args.rowindex;
        console.log("click at" + row);
        var data = $('#nghesi_danhsach').jqxGrid('getrowdata', row);
        $("#nghesi_nghedanh").val(data["nghedanh"]);
	$("#nghesi_tenthat").val(data["tenthat"]);
        $("#nghesi_like").text("Like: " + data["like"]);
            
        //kiem tra coi ca si con hoat dong khong
        var conhoatdong = data["conhoatdong"];
        if (conhoatdong == 1){
            $('#nghesi_conhoatdong').jqxCheckBox({ checked:true }); 
        }
        else{
            $('#nghesi_conhoatdong').jqxCheckBox({ checked:false }); 
        }
            
            //lay ngay sinh theo dung dinh dang
            //yyyy/mm/dd
        var ngaysinh = data["ngaysinh"].toString();
        var ngay = ngaysinh.substr(8, 2);
        var thang = ngaysinh.substr(5, 2);
        var nam = ngaysinh.substr(0, 4);
            //lay ra xong roi gan vao #ngaysinh
        $("#nghesi_ngaysinh").jqxDateTimeInput({ value: new Date(nam, parseInt(thang) - 1, ngay) });
            //phai tru 1 vi thang bat dau bang 0
	$("#nghesi_tieusu").val(data["tieusu"]);
        $('#nghesi_anhdaidien_show').attr('src', "resources/img/nghe_si/" + data["id"] + ".png");
    });
    var theme='energyblue';
    $("#nghesi_danhsach").jqxGrid({
        theme:theme,
        width: 400,
        height: 585,
        source: dataAdapter,
        sortable: true,
        pageable: true,
        //virtualmode: true,
        rendergridrows: function (params) {
            return params.data;
        },
        rowsheight: 40,
        columns: [
            { text: "Mã", datafield: 'id', width: 50, hidden: false },
            { text: "Tên thật", datafield: 'tenthat', width: 100, hidden: true },
            { text: "Nghệ danh", datafield: 'nghedanh', fixed: true, cellsrenderer: nghedanh_renderer},
            { text: "Ngày sinh", datafield: 'ngaysinh', width: 100, hidden: true },
            { text: "Tiểu sử", datafield: 'tieusu', width: 100, hidden: true },
            { text: "Còn HD", datafield: 'conhoatdong', width: 100, hidden: false, cellsrenderer: conhoatdong_renderer},
            { text: "Like", datafield: 'luotlike', width: 100, hidden: true }
            ]
        });
    });
</script>
<div id = "nghesi_danhsach"></div>